<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>

<html>
<head>
    <%@include file="../common/_head.jsp" %>
    <script src="${ctx}/resources/wechat/echats/echarts.simple.min.js"></script>
</head>
<body ontouchstart>
<div style="padding: 10px">
    <h4>${elect.title}</h4>
    <p>${elect.description}</p>
    <h5>投票数量：${elect.electedNumber}</h5>
    <h5>截止时间：${elect.closeDate}</h5>
    <h5>完成比例：${elect.completeRatio}</h5>
    <h5>投票结果：</h5>
    <h5 id="fact"></h5>
    <div id="main" style="width: 600px;height:400px;"></div>
</div>

<%@include file="../common/_foot.jsp" %>
<script>
    $(document).ready(function(){
        var doubleArray = [];
        "${elect.fact}".split(",").forEach(function(value,index,array){
            doubleArray.push(value.split(":"));
        });
        // doubleArray进行排序
        doubleArray.sort(function (a, b) {
            if(a[2]>b[2]){
                return -1;
            }else if(a[2]==b[2]){
                return 0;
            }else if(a[2]<b[2]){
                return 1;
            }
        });
        var factStr = "";
        doubleArray.forEach(function (item) {
            factStr += item[1] + ":" + item[2] + "<br/>";
        });
        $("#fact").html(factStr);
    });

    // // 基于准备好的dom，初始化echarts实例
    // var myChart = echarts.init(document.getElementById('main'));
    //
    // // 指定图表的配置项和数据
    // var option = {
    //     title : {
    //         text: '世界人口总量',
    //         subtext: '数据来自网络'
    //     },
    //     tooltip : {
    //         trigger: 'axis'
    //     },
    //     legend: {
    //         data:['得票']
    //     },
    //     // toolbox: {
    //     //     show : false,
    //     //     feature : {
    //     //         mark : {show: true},
    //     //         dataView : {show: true, readOnly: false},
    //     //         magicType: {show: true, type: ['line', 'bar']},
    //     //         restore : {show: true},
    //     //         saveAsImage : {show: true}
    //     //     }
    //     // },
    //     // calculable : true,
    //     xAxis : [
    //         {
    //             type : 'value',
    //             boundaryGap : [0, 0.01]
    //         }
    //     ],
    //     yAxis : [
    //         {
    //             type : 'category',
    //             data : ['巴西','印尼','美国','印度','中国','世界人口(万)']
    //         }
    //     ],
    //     series : [
    //         {
    //             name:'得票',
    //             type:'bar',
    //             data:[18203, 23489, 29034, 104970, 131744, 630230]
    //         }
    //     ]
    // };
    // // 使用刚指定的配置项和数据显示图表。
    // myChart.setOption(option);

</script>
</body>
</html>